<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/static/css/login-style.css" rel='stylesheet' type='text/css'/>

    <script src="/static/js/jquery-1.11.1.min.js?v=0.0.1"></script>
    <script src="/static/js/jQuery.md5.js?v=0.0.1"></script>
    <script src="/static/js/jquery.validate.min.js?v=0.0.1"></script>
    <script src="/static/js/form2json.js?v=0.0.1"></script>

    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>

    <style>
        input:-webkit-autofill,
        textarea:-webkit-autofill,
        select:-webkit-autofill {
            color: #9199aa;
            -webkit-box-shadow: 0 0 0 1000px #2b2b36 inset !important;
        }
    </style>
</head>
<body>
<script>
    $(document).ready(function (c) {
        $('.close').on('click', function (c) {
            $('.login-form').fadeOut('slow', function (c) {
                $('.login-form').remove();
            });
        });
    });
</script>
<!--SIGN UP-->
<h1>weseal Login</h1>
<div class="login-form">
    <div class="head-info"></div>
    <div class="clear"></div>
    <div class="avtar">
        <img src="/static/images/avtar.png"/>
    </div>
    <form autocomplete="off" id="loginForm" name="loginForm" action="/master/login" method="post">
        <div>
            <div id="errorMessage"></div>
        </div>
        <div>
            <span class="loginIcon">
                <input id="loginName" name="loginName" type="text" class="text" value="" autocomplete="off"
                       placeholder="loginName">
            </span>
        </div>
        <div>
            <span>
                <input id="password" name="password" type="password" autocomplete="off" value="" placeholder="password">
            </span>
        </div>
        <div class="signin">
            <input id="login" type="submit" value="登录">
        </div>
    </form>

</div>
<div class="copy-rights">
    <p>
        美少女兼职人员管理平台 | 个人管理系统 | 474869728@qq.com | 免责声明
    </p>
</div>

</body>
<script type="application/javascript">
    $(document).ready(function () {
        $("#loginForm").validate({
            submitHandler: function () {
                var form = $('#loginForm').serializeObject();
                var password = form["password"] || '';
                form["password"] = $.md5(password);
                $.ajax({
                    url: '/login',
                    dataType: 'json',
                    type: 'post',
                    data: form,
                    error: function () {
                    },
                    success: function (data) {
                        if (data.code !== "200") {
                            $("#errorMessage").addClass("key").addClass("login-error").text(data.message);
                        } else {
                            window.location.href = '<c:url value="/index"/>';
                        }
                    }
                })
            },
            rules: {
                loginName: {
                    required: true,
                    minlength: 4
                },
                password: {
                    required: true,
                    minlength: 6
                }
            },
            messages: {
                loginName: {
                    required: "请输入用户名",
                    minlength: "用户名不能小于 4 位"
                },
                password: {
                    required: "请输入密码",
                    minlength: "密码长度不能小于 6 个字母"
                }
            },
            showErrors: function (errorMap, errorList) {
                if (jQuery.isEmptyObject(errorMap)) {
                    $("#errorMessage").removeClass("login-error").text("");
                }
                for (var key in errorMap) {
                    $("#errorMessage").addClass("key").addClass("login-error").text(errorMap[key]);
                    break;
                }
                this.defaultShowErrors();
            },
            errorPlacement: function (error, element) {
                if ($("#errorMessage").hasClass("login-error"))
                    return false;

            }
        });

    })
</script>
</html>
